import { useEffect, useState } from 'react'

interface WindowDistance {
    scrollTop: number;
    scrollDown: number;
}

function useWindowDistance(): WindowDistance {
    const [windowDistance, setWindowDistance] = useState<WindowDistance>({
        scrollTop: 0,
        scrollDown: 0
    })

    useEffect(() => {


        const handler = () => {

            const clientHeight = document.documentElement.clientHeight //浏览器高度
            const scrollHeight = document.body.scrollHeight
            const scrollTop = document.documentElement.scrollTop

            setWindowDistance({
                scrollTop: scrollTop,
                scrollDown: scrollHeight - (scrollTop + clientHeight)
            })
        }

        handler()

        document.addEventListener('wheel', () => {
            // e.preventDefault()
            handler()
        })

        return document.removeEventListener('wheel', handler)
    }, [])

    return windowDistance
}

export default useWindowDistance